<?php
/**
 * @version     kingadmin-v1.2-tx
 * @package     tpl_gpcb
 * @copyright   Copyright (C) 2014. All Rights Reserved
 * @license     Creative Commons Attribution-NoDerivatives 4.0 International License
 * @author      caballeroantonio <caballeroantonio@hotmail.com> - http://caballeroantonio.com
 */

// No direct access
defined('_JEXEC') or die;

$kbpath = 'templates/gpcb';
$this->document->page_class = 'comp-wizard';
?>

							<div class="main-header">
								<h2>Wizard</h2>
								<em>wizard with validation</em>
							</div>

							<div class="main-content">
								<!-- WIDGET WIZARD -->
								<div class="widget">
									<div class="widget-header"><h3><i class="fa fa-magic"></i> Wizard</h3></div>
									<div class="widget-content">
										<div class="wizard-wrapper">
											<div id="demo-wizard" class="wizard">
												<ul class="steps">
													<li data-target="#step1" class="active"><span class="badge badge-info">1</span>Account Type<span class="chevron"></span></li>
													<li data-target="#step2"><span class="badge">2</span>User Account<span class="chevron"></span></li>
													<li data-target="#step3"><span class="badge">3</span>Options<span class="chevron"></span></li>
													<li data-target="#step4" class="last"><span class="badge">4</span>Create Account</li>
												</ul>
											</div>
											<div class="step-content">
												<div class="step-pane active" id="step1">
													<form id="form1" parsley-validate novalidate>
														<p>Choose your account type:</p>
														<div class="simple-radio" id="account-type">
															<input id="personal" type="radio" name="account-type" value="personal" parsley-required="true">
															<label for="personal">Personal</label>
															<input id="business" type="radio" name="account-type" value="business">
															<label for="business">Business</label>
															<input id="enterprise" type="radio" name="account-type" value="enterprise">
															<label for="enterprise">Enterprise</label>
														</div>
													</form>
												</div>
												<div class="step-pane" id="step2">
													<form id="form2" parsley-validate novalidate>
														<p>Please provide email, username and password<br/>
															<em><small>Field marked * is required</small></em>
														</p>
														<div class="row">
															<div class="col-md-3">
																<div class="form-group">
																	<label for="email">Email *</label>
																	<input type="email" class="form-control" required>
																</div>
																<div class="form-group">
																	<label for="password">Password *</label>
																	<input type="password" id="password" name="password" class="form-control" required>
																</div>
																<div class="form-group">
																	<label for="password2">Repeat Password *</label>
																	<input type="password" id="password2" name="password2" class="form-control" required parsley-equalto="#password" parsley-equalto-message="Password doesn't match.">
																</div>
															</div>
														</div>
													</form>
												</div>
												<div class="step-pane" id="step3">
													<form id="form3" parsley-validate novalidate>
														<div class="simple-checkbox">
															<input type="checkbox" id="newsletter" name="newsletter">
															<label for="newsletter">Subscribe to monthly newsletter</label>
														</div>
														<div class="simple-checkbox">
															<input type="checkbox" id="terms" name="terms">
															<label for="terms">I accept the <a href="#">Terms &amp; Agreements</a></label>
														</div>
													</form>
												</div>
												<div class="step-pane" id="step4">
													<p class="lead"><i class="fa fa-check-circle text-success"></i> All is well! Click "Create My Account" to complete.</p>
												</div>
											</div>
											<div class="actions">
												<button type="button" class="btn btn-default btn-prev"><i class="fa fa-arrow-left"></i> Prev</button>
												<button type="button" class="btn btn-primary btn-next">Next <i class="fa fa-arrow-right"></i></button>
											</div>
										</div>
									</div>
								</div>
								<!-- END WIDGET WIZARD -->
							</div><!-- /main-content -->
						

	<!-- Javascript -->
	<script src="<?= $kbpath ?>/assets/js/wizard.min.js"></script>
	<script src="<?= $kbpath ?>/assets/js/parsley.min.js"></script>
	<script src="<?= $kbpath ?>/assets/js/king-components.js"></script>
